<div class="container">
	<div class="panel panel-default">
	  <div class="panel-heading">
	    <h4 class="panel-title">书目信息</h4>
	  </div>
	  <div class="panel-body">
	  	<div class="row" style="margin:10px;">
	  		{{#if bookInfo}}
				<dl class="booklist clearfix">
					<dt>题名:</dt>
					<dd><a href="">{{bookInfo.title}}</a></dd>
				</dl>
				<dl class="booklist clearfix">
					<dt>作者/责任者:</dt>
					<dd>{{bookInfo.author}}</dd>
				</dl>
				<dl class="booklist clearfix">
					<dt>版本说明:</dt>
					<dd>第1版</dd>
				</dl>
				<dl class="booklist clearfix">
				<dt>出版发行项:</dt>
				<dd>{{bookInfo.press}}</dd>
				</dl>
				<dl class="booklist clearfix">
					<dt>ISBN及定价:</dt>
					<dd>{{bookInfo.isbn}}/CNY{{bookInfo.price}}</dd>
				</dl>
				<dl class="booklist clearfix">
					<dt valign="top">内容简介: </dt>
					<dd style="padding-bottom: 8px;">{{bookInfo.content}}</dd>
				</dl>
				<dl class="booklist clearfix">
					<dt>目录: </dt>
					<dd>{{bookInfo.catalog}}</dd>
				</dl>
                <dl class="booklist clearfix">
                    <dt>图片: </dt>
                    <dd><img src="{{bookInfo.pic}}"></dd>
                </dl>
				{{/if}}
	  	</div>
	  	<div class="row" style="margin:10px;">
	  		<div class="bs-example bs-example-tabs">
			    <ul class="nav nav-tabs" role="tablist">
			      <li role="presentation" class="active">
			      	<a href="#home" id="home-tab" role="tab" data-toggle="tab">馆藏信息</a>
			      </li>
			      <li role="presentation">
			      	<a href="#profile" role="tab" data-toggle="tab">预约申请</a>
			      </li>
			    </ul>
			    <div class="tab-content">
			      <div role="tabpanel" class="tab-pane fade active in" id="home" aria-labelledby="home-tab">
          		<table class="table">
          			<thead>
          				<tr>
          					<th>索书号</th>
          					<th>条码号</th>
          					<th>馆藏地</th>
          					<th>书刊状态</th>
          					<th>执行借阅</th>
          				</tr>
          			</thead>
          			<tbody>
          				{{#each booksState}}
          				<tr>
        	          <td>{{callNumber}}</td>
        	          <td>{{barcode}}</td>
        	          <td>{{address}}</td>
        	          <td>{{state}}</td>
        	          <td>{{{isBorrow}}}</td>
        	        </tr>
        	        {{/each}}
          			</tbody>
          		</table>
			      </div>
			      <div role="tabpanel" class="tab-pane fade" id="profile" aria-labelledby="profile-tab">
			        <table class="table">
          			<thead>
          				<tr>
          					<th>索书号</th>
          					<th>馆藏地</th>
          					<th>取书地</th>
          					<th>是否可预约</th>
          				</tr>
          			</thead>
          			<tbody>
          				<tr>
          					{{#if bookInfo}}
        	          <td>{{bookInfo.callNumber}}</td>
        	          <td>{{bookInfo.address}}</td>
        	          <td>借还书处(2F)</td>
        	          <td>{{{isOrder}}}</td>
        	          {{/if}}
        	        </tr>
          			</tbody>
          		</table>
			      </div>
			    </div>
			  </div>
	  	</div>
	  </div>
	</div>

	<!-- 预约弹出框 -->
	<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
	  <div class="modal-dialog">
	    <div class="modal-content">
	      <div class="modal-header">
	        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
	        <h4 class="modal-title" id="myModalLabel">确认预约此书？</h4>
	      </div>
	      <div class="modal-body">
	      {{#if bookInfo}}
	      <div>{{bookInfo.callnumber}}</div>
	      <div>{{bookInfo.title}}</div>
				<div>{{bookInfo.author}}</div>
	      {{/if}}
	      </div>
	      <div class="modal-footer">
	        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
	        <button type="button" class="btn btn-primary">确认</button>
	      </div>
	    </div>
	  </div>
	</div>

	{{>footer}}
</div>